﻿<%@ page language="java" import="java.util.*" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<html xmlns="http://www.w3.org/1999/xhtml" lang="en-US">
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit|ie-comp|ie-stand">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/>
    <meta http-equiv="Cache-Control" content="no-siteapp"/>
    <!--[if lt IE 9]>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/HuiAdmin/lib/html5shiv.js"></script>
    <script type="text/javascript" src="${pageContext.request.contextPath}/static/HuiAdmin/lib/respond.min.js"></script>
    <![endif]-->
    <link rel="stylesheet" type="text/css"
          href="${pageContext.request.contextPath}/static/HuiAdmin/static/h-ui/css/H-ui.min.css"/>
    <link rel="stylesheet" type="text/css"
          href="${pageContext.request.contextPath}/static/HuiAdmin/static/h-ui.admin/css/H-ui.admin.css"/>
    <link rel="stylesheet" type="text/css"
          href="${pageContext.request.contextPath}/static/HuiAdmin/lib/Hui-iconfont/1.0.8/iconfont.css"/>
    <link rel="stylesheet" type="text/css"
          href="${pageContext.request.contextPath}/static/HuiAdmin/static/h-ui.admin/skin/default/skin.css" id="skin"/>
    <link rel="stylesheet" type="text/css"
          href="${pageContext.request.contextPath}/static/HuiAdmin/static/h-ui.admin/css/style.css"/>
    <!--[if IE 6]>
    <![endif]-->
    <title>用户管理</title>
</head>
<body>
<nav class="breadcrumb"><i class="Hui-iconfont">&#xe67f;</i> 首页 <span class="c-gray en">&gt;</span> 联盟 <span
        class="c-gray en">&gt;</span> 联盟信息
</nav>
<div class="page-container">
    <div class="cl pd-5 bg-1 bk-gray mt-10">
        <span class="l">
            <form method="post" action="${pageContext.request.contextPath}/affpayInfo/page/info.do" id="criteria">
                <table>
                    <tr>
                        <td style="width: 160px; padding-right: 24px;">
                            <span class="select-box">
                                <select class="select" size="1" id="PayMethod" name="PayMethod">
                                    <option value="" selected>Pay Method</option>
                                    <c:forEach items="${payMethodList}" var="item">
                                        <option>${item}</option>
                                    </c:forEach>
                                </select>
                            </span>
                        </td>
                        <td style="width: 160px; padding-right: 24px;">
                            <span class="select-box">
                                <select class="select" size="1" id="PayFre" name="PayFre">
                                    <option value="" selected>Pay Frequency</option>
                                    <c:forEach items="${payFreList}" var="item">
                                        <option>${item}</option>
                                    </c:forEach>
                                </select>
                            </span>
                        </td>
                        <td style="width: 160px; padding-right: 24px;">
                            <span class="select-box">
                                <select class="select" size="1" id="MinPay" name="MinPay">
                                    <option value="" selected>Min-Pay</option>
                                    <c:forEach items="${payMinList}" var="item">
                                        <option>${item}</option>
                                    </c:forEach>
                                </select>
                            </span>
                        </td>
                        <td style="width: 160px; padding-right: 24px;">
                            <span class="select-box">
                                <select class="select" size="1" id="PayCom" name="PayCom">
                                    <option value="" selected>Pay Commission</option>
                                      <c:forEach items="${payCommList}" var="item">
                                          <option>${item}</option>
                                      </c:forEach>
                                </select>
                            </span>
                        </td>

                        <td>
                            <button type="button" class="btn btn-success radius" id="btnSubmit"
                                    onclick="RefreshPage(1)"><i
                                    class="Hui-iconfont">&#xe665;</i></button>
                        </td>
                    </tr>
                </table>
            </form>
        </span>
        <span class="r" id="TotalNum">
            <input type="hidden" id="curPage" value="${cPage}">
            <input type="hidden" id="tolPage" value="${pTotal}">
            <strong>${bNum} - ${eNum} / ${nTotal}</strong> 条
        </span>
    </div>
    <div class="mt-10">
        <table class="table table-border table-bordered table-hover table-bg">
            <thead>
            <tr class="text-c">
                <th width="25px"><input type="checkbox" name="" value=""></th>
                <th width="80px"></th>
                <th width="120px"></th>
                <th width="130px">Starts</th>
                <th width="130px">Offers</th>
                <th width="130px">Payout</th>
                <th width="130px">Tracking</th>
                <th width="130px">Support</th>
                <th width="80px">Min-Pay</th>
                <th>Pay-Frequency</th>
                <th width="80px"></th>
            </tr>
            </thead>
            <tbody id="affInfo">
            <c:forEach items="${lists}" var="item">
                <tr class="text-c">
                    <td width="25px"><input type="checkbox" value="${item.id}" name=""></td>
                    <td width="80px">
                        <strong class="f-l f-10 va-m">${item.affpayName}</strong></td>
                    <td width="120px">
                        <img src="${pageContext.request.contextPath}/utils/affpay/${item.imgUrl}" width="108px"
                             height="46px">
                    </td>
                    <td width="130px">
                        <div class="clearfix">
                            <div class="star-bar star-bar-show size-S f-l va-m  mr-10">
                                <span class="star f-l va-m" style="width:${item.startsNum / 5 * 100}%"></span>
                            </div>
                            <strong class="f-l f-10 va-m">${item.startsNum}</strong>
                        </div>
                    </td>
                    <td width="130px">
                        <div class="clearfix">
                            <div class="star-bar star-bar-show size-S f-l va-m  mr-10">
                                <span class="star f-l va-m" style="width:${item.offers / 5 * 100}%"></span>
                            </div>
                            <strong class="f-l f-10 va-m">${item.offers}</strong>
                        </div>
                    </td>
                    <td width="130px">
                        <div class="clearfix">
                            <div class="star-bar star-bar-show size-S f-l va-m  mr-10">
                                <span class="star f-l va-m" style="width:${item.payout / 5 * 100}%"></span>
                            </div>
                            <strong class="f-l f-10 va-m">${item.payout}</strong>
                        </div>
                    </td>
                    <td width="130px">
                        <div class="clearfix">
                            <div class="star-bar star-bar-show size-S f-l va-m  mr-10">
                                <span class="star f-l va-m" style="width:${item.tracking / 5 * 100}%"></span>
                            </div>
                            <strong class="f-l f-10 va-m">${item.tracking}</strong>
                        </div>
                    </td>
                    <td width="130px">
                        <div class="clearfix">
                            <div class="star-bar star-bar-show size-S f-l va-m  mr-10">
                                <span class="star f-l va-m" style="width:${item.support / 5 * 100}%"></span>
                            </div>
                            <strong class="f-l f-10 va-m">${item.support}</strong>
                        </div>
                    </td>
                    <td width="80px"> ${item.minimumPayment}</td>
                    <td>${item.paymentFrequency}</td>
                    <td>
                        <input class="btn btn-warning-outline radius" onclick="window.open('${item.registUrl}')" type="button"
                               value="Regist">
                    </td>
                </tr>
            </c:forEach>
            </tbody>
        </table>
    </div>
    <div class="mt-10">
        <span class="text-c" id="pageNum">
            <div class="btn-group">
              <span class="btn btn-primary radius" onclick="prevPage();">上一页</span>
              <span class="btn btn-default radius" onclick="nextPage();">下一页</span>
            </div>
        </span>
    </div>
    <div class="mt-10"></div>
</div>
<!--_footer 作为公共模版分离出去-->
<script type="text/javascript"
        src="${pageContext.request.contextPath}/static/HuiAdmin/lib/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="${pageContext.request.contextPath}/static/HuiAdmin/lib/layer/2.4/layer.js"></script>
<script type="text/javascript"
        src="${pageContext.request.contextPath}/static/HuiAdmin/static/h-ui/js/H-ui.min.js"></script>
<script type="text/javascript"
        src="${pageContext.request.contextPath}/static/HuiAdmin/static/h-ui.admin/js/H-ui.admin.js"></script>
<!--/_footer 作为公共模版分离出去-->

<!--请在下方写此页面业务相关的脚本-->
<script type="text/javascript"
        src="${pageContext.request.contextPath}/static/HuiAdmin/lib/My97DatePicker/4.8/WdatePicker.js"></script>
<script type="text/javascript"
        src="${pageContext.request.contextPath}/static/HuiAdmin/lib/datatables/1.10.0/jquery.dataTables.min.js"></script>
<%--<script type="text/javascript"--%>
<%--src="${pageContext.request.contextPath}/static/HuiAdmin/lib/laypage/1.2/laypage.js"></script>--%>
<script type="text/javascript">
    $(function () {
        $('.table-sort').dataTable({
            "aaSorting": [[1, "desc"]],//默认第几个排序
            "bStateSave": true,//状态保存
            "aoColumnDefs": [
                //{"bVisible": false, "aTargets": [ 3 ]} //控制列的隐藏显示
                {"orderable": false, "aTargets": [0, 8, 9]}// 制定列不参与排序
            ]
        });

    });
    function prevPage() {
        var iPage = $("#curPage").val();
        if (parseInt(iPage) > 1) {
            RefreshPage(parseInt(iPage) - 1);
        }
    }

    function nextPage() {
        var iPage = $("#curPage").val();
        var tolPage = $("#tolPage").val();
        if (parseInt(iPage) + 1 <= parseInt(tolPage)) {
            RefreshPage(parseInt(iPage) + 1);
        }
    }

    function RefreshPage(iPage) {
        var sPayMethod = $("#PayMethod option:selected").text();
        var sPayFre = $("#PayFre option:selected").text();
        var sMinPay = $("#MinPay option:selected").text();
        var sPayCom = $("#PayCom option:selected").text();
        $.ajax({
                type: "POST",
                url: $("#criteria").attr("action"),
//            contentType: 'application/json;charset=utf-8',
                data: {
                    PayMethod: sPayMethod,
                    PayFre: sPayFre,
                    MinPay: sMinPay,
                    PayCom: sPayCom,
                    queryPage: iPage
                },
                dataType: "json",
                success: function (data) {
                    if (data.isSuccessed == true) {
                        var affInfohtml = '';
                        if (typeof(data.lists ) != "undefined") {
                            $.each(data.lists, function (iIndex, affpayInfo) {
                                affInfohtml += '<tr class="text-c"> <td width="25px"><input type="checkbox" value="' + affpayInfo.id + '" name=""></td>';
                                affInfohtml += '<td width="80px"> <strong class="f-l f-10 va-m">' + affpayInfo.affpayName + '</strong></td>';
                                affInfohtml += '<td width="120px"><img src="${pageContext.request.contextPath}/utils/affpay/' + affpayInfo.imgUrl + '" width="108px" height="46px">';
                                affInfohtml += '</td><td width="130px"><div class="clearfix"><div class="star-bar star-bar-show size-S f-l va-m  mr-10">';
                                if (affpayInfo.startsNum != null && typeof(affpayInfo.startsNum ) != "undefined") {
                                    affInfohtml += '<span class="star f-l va-m" style="width:' + affpayInfo.startsNum / 5 * 100 + '%"></span></div>';
                                    affInfohtml += '<strong class="f-l f-10 va-m">' + affpayInfo.startsNum + '</strong></div></td><td width="130px"><div class="clearfix">';
                                } else {
                                    affInfohtml += '<span class="star f-l va-m" style="width:0%"></span></div>';
                                    affInfohtml += '<strong class="f-l f-10 va-m"></strong></div></td><td width="130px"><div class="clearfix">';
                                }
                                if (affpayInfo.offers != null && typeof(affpayInfo.offers ) != "undefined") {
                                    affInfohtml += '<div class="star-bar star-bar-show size-S f-l va-m  mr-10"><span class="star f-l va-m" style="width:' + affpayInfo.offers / 5 * 100 + '%"></span>';
                                    affInfohtml += '</div><strong class="f-l f-10 va-m">' + affpayInfo.offers + '</strong></div></td><td width="130px"><div class="clearfix">';
                                } else {
                                    affInfohtml += '<div class="star-bar star-bar-show size-S f-l va-m  mr-10"><span class="star f-l va-m" style="width:0%"></span>';
                                    affInfohtml += '</div><strong class="f-l f-10 va-m"></strong></div></td><td width="130px"><div class="clearfix">';
                                }
                                if (affpayInfo.payout != null && typeof(affpayInfo.payout ) != "undefined") {
                                    affInfohtml += '<div class="star-bar star-bar-show size-S f-l va-m  mr-10"><span class="star f-l va-m" style="width:' + affpayInfo.payout / 5 * 100 + '%"></span>';
                                    affInfohtml += '</div><strong class="f-l f-10 va-m">' + affpayInfo.payout + '</strong></div></td><td width="130px"><div class="clearfix">';
                                } else {
                                    affInfohtml += '<div class="star-bar star-bar-show size-S f-l va-m  mr-10"><span class="star f-l va-m" style="width:0%"></span>';
                                    affInfohtml += '</div><strong class="f-l f-10 va-m"></strong></div></td><td width="130px"><div class="clearfix">';
                                }
                                if (affpayInfo.tracking != null && typeof(affpayInfo.tracking ) != "undefined") {
                                    affInfohtml += '<div class="star-bar star-bar-show size-S f-l va-m  mr-10"><span class="star f-l va-m" style="width:' + affpayInfo.tracking / 5 * 100 + '%"></span>';
                                    affInfohtml += '</div><strong class="f-l f-10 va-m">' + affpayInfo.tracking + '</strong></div></td><td width="130px"><div class="clearfix">';
                                } else {
                                    affInfohtml += '<div class="star-bar star-bar-show size-S f-l va-m  mr-10"><span class="star f-l va-m" style="width:0%"></span>';
                                    affInfohtml += '</div><strong class="f-l f-10 va-m"></strong></div></td><td width="130px"><div class="clearfix">';
                                }
                                if (affpayInfo.support != null && typeof(affpayInfo.support ) != "undefined") {
                                    affInfohtml += '<div class="star-bar star-bar-show size-S f-l va-m  mr-10"><span class="star f-l va-m" style="width:' + affpayInfo.support / 5 * 100 + '%"></span>';
                                    affInfohtml += '</div><strong class="f-l f-10 va-m">' + affpayInfo.support + '</strong></div></td><td width="80px"> ' + affpayInfo.minimumPayment + '</td>';
                                } else {
                                    affInfohtml += '<div class="star-bar star-bar-show size-S f-l va-m  mr-10"><span class="star f-l va-m" style="width:0%"></span>';
                                    affInfohtml += '</div><strong class="f-l f-10 va-m"></strong></div></td><td width="80px"> ' + affpayInfo.minimumPayment + '</td>';
                                }
                                affInfohtml += '<td>' + affpayInfo.paymentFrequency + '</td><td><input class="btn btn-warning-outline radius" onclick="window.open(\'' + affpayInfo.registUrl + '\')" type="button" value="Regist">';
                                affInfohtml += '</td></tr>';
                            });
                        }
                        $("#affInfo").html("");
                        $("#affInfo").html(affInfohtml);
                        var affPageHtml = '<input type="hidden" id="curPage" value="' + data.cPage + '"><input type="hidden" id="tolPage" value="' + data.pTotal + '"><strong id="TotalNum">' + data.bNum + ' -  ' + data.eNum + ' / ' + data.nTotal + '</strong> 条';
                        $("#TotalNum").html('');
                        $("#TotalNum").html(affPageHtml);
                    }
                }
            }
        )
        ;
    }
</script>
</body>
</html>